.search {
  align-items: center;
  display: flex;

  input {
    border-radius: 0;
    border: none;
    flex: 1;
    font-size: 12px;
    outline: none;
    padding: 12px 16px;
  }
  input:focus {
    box-shadow: none;
  }
  input::placeholder {
    color: #999;
  }
}

.filter {
  align-items: center;
  color: #666;
  display: flex;
  margin-right: 12px;
  padding: 2px 0 2px 5px;
  label {
    font-size: 12px;
  }
  svg {
    height: 22px;
    width: 22px;
  }
}
.filter-tooltip :global(.ant-tooltip-inner) {
  color: #111;
  padding: 0;
  :global(.ant-radio-wrapper) {
    display: block;
    font-size: 12px;
    letter-spacing: 1px;
    padding: 6px 8px;
    margin: 0;
    &:not(:last-child) {
      border-bottom: 1px solid #ddd;
    }
    &:hover {
      background-color: #fafafa;
    }
  }
}

.modal {
  max-width: 80vw;

  :global(.ant-modal-body) {
    padding: 0;
  }

  header {
    border-bottom: 1px solid #e5e5e5;
    padding: 0 12px;
    position: relative;
  }
}

.modal header :global(.ant-input-affix-wrapper) {
  border: none;
  box-shadow: none;
  font-size: 16px;

  :global(.ant-input-prefix) {
    color: #999;
    font-size: 20px;
  }

  input:global(.ant-input) {
    border-radius: 0;
    border: none;
    font-size: 16px;
    outline: none;
    padding: 10px 12px;
    &:focus {
      box-shadow: none;
    }
    &::placeholder {
      color: #999;
    }
  }
}

.extra-search {
  align-items: center;
  border-bottom: 1px solid #e5e5e5;
  color: #999;
  cursor: pointer;
  display: flex;
  font-size: 12px;
  padding: 12px 20px;
  transition: all 0.1s ease-in;
  &:hover {
    color: #777;
    background-color: #fcfcfc;
  }
  :global(.anticon) {
    font-size: 18px;
    margin-right: 8px;
  }
}
